import React, { Fragment } from 'react';
import { DatePicker, Card, Content } from 'react-fule-ui';
import './index.scss';
export default function FullDatePicker(props) {
  // 点击 - 筛选年月
  const changDate = (year, mounth, day, status) => {
    console.log(year, mounth, day, status);
  };
  return (
    <Fragment>
      <Content>
        <Content.Header>日期选择器</Content.Header>
        <Content.Body>
          <Card>
            <Card.Header>基础用法</Card.Header>
            <Card.Body>
              <div className="demo-block">
                <DatePicker
                  defaultValue="2020-02-01"
                  starAge="2020"
                  endAge="2028"
                  startMonth="1"
                  endMonth="12"
                  onChange={changDate}
                  // style={{ opacity: 0.4 }}
                  className="abc"
                  overlayClassName="abc"
                // overlayStyle={{ opacity: 0.4 }}
                // open={true}
                ></DatePicker>
              </div>
              <div className="demo-block">
                <DatePicker
                  placeholder="请选择日期"
                  starAge="2020"
                  endAge="2038"
                  onChange={changDate}
                ></DatePicker>
              </div>
              <div className="demo-block">
                <DatePicker
                  defaultValue="2020-02-01"
                  starAge="2020"
                  endAge="2028"
                  onChange={changDate}
                ></DatePicker>
              </div>
              <div className="demo-block">
                <DatePicker
                  defaultValue="2020-20-20"
                  starAge="2020"
                  endAge="2028"
                  onChange={changDate}
                ></DatePicker>
              </div>
            </Card.Body>
          </Card>
        </Content.Body>
      </Content>
    </Fragment>
  );
}
